<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>首页</title>
    <meta name="Keywords" content="" />
    <meta name="description" content="" />
    <link rel="stylesheet" href="./css/swiper.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/nav.css">
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>

<div class="home">

    <div class="head">
        <a href="./index.html" class="logo">
            <img src="./images/logo.png" alt="">
            <img src="./images/logo_on.png" alt="">
        </a>
        <div class="r">
            <div class="flex">
                <a href="">宁波材料所</a>
                <a href="">联系方式</a>
                <a href="">留言反馈</a>
            </div>
            <div class="other">
                <div class="nav">
                    <a href="./index.html" class="on">首页</a>
                    <a href="news.html">工作动态</a>
                    <a href="news.html">培训讲座</a>
                    <a href="equipment.html">仪器平台</a>
                    <a href="people.html">支撑队伍</a>
                    <a href="news.html">联系方式</a>
                </div>
                <div class="search">
                    <img src="./images/search.png" alt="">
                </div>
            </div>
        </div>
    </div>

    <div class="pheader">
        <div class="menu">
            <a href="./index.html" target="_self" class="animated fadeInUpLeft">
                <img src="./images/logo.png" alt="">
            </a>
            <div class="navbox">
                <div class="line"></div>
                <div class="line"></div>
                <div class="line"></div>
            </div>
        </div>
    </div>

    <div class="menuList">
        <div class="item animated fadeInUp">
            <div class="tb">
                <a href="./index.html">首页</a>
            </div>
        </div>
        <div class="item animated fadeInUp">
            <div class="tb">
                <a href="./news.html">工作动态</a>
            </div>
        </div>
        <div class="item animated fadeInUp">
            <div class="tb">
                <a href="./news.html">培训讲座</a>
            </div>
        </div>
        <div class="item animated fadeInUp">
            <div class="tb">
                <a href="./equipment.html">仪器平台</a>
            </div>
        </div>
        <div class="item animated fadeInUp">
            <div class="tb">
                <a href="./people.html">支撑队伍</a>
            </div>
        </div>
        <div class="item animated fadeInUp">
            <div class="tb">
                <a href="">联系方式</a>
            </div>
        </div>
    </div>

    <div class="search_box" style="display: none;">
        <div class="close">
            <img src="./images/close.svg" alt="">
        </div>
        <div class="content">
            <input type="text" placeholder="请输入关键词">
            <a href="">
                <img src="./images/search.svg" alt="">
            </a>
        </div>
    </div>

    <div id="luxy">

        <!--        首页banner-->


        <div class="index1">
            <div class="swiper swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <img src="./images/banner.png" alt="">
                        <div class="text">
                            <p class="cn">
                                敬业爱岗  服务科研
                            </p>
                            <p class="en">
                                Dedication to work & Service research
                            </p>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <img src="./images/banner.png" alt="">
                        <div class="text">
                            <p class="cn">
                                敬业爱岗  服务科研
                            </p>
                            <p class="en">
                                Dedication to work & Service research
                            </p>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <img src="./images/banner.png" alt="">
                        <div class="text">
                            <p class="cn">
                                敬业爱岗  服务科研
                            </p>
                            <p class="en">
                                Dedication to work & Service research
                            </p>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <img src="./images/banner.png" alt="">
                        <div class="text">
                            <p class="cn">
                                敬业爱岗  服务科研
                            </p>
                            <p class="en">
                                Dedication to work & Service research
                            </p>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <img src="./images/banner.png" alt="">
                        <div class="text">
                            <p class="cn">
                                敬业爱岗  服务科研
                            </p>
                            <p class="en">
                                Dedication to work & Service research
                            </p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="position">
                <div class="line"></div>
                <div class="display">
                    <div class="list on">
                        <svg viewBox="0 0 54 54">
                            <path class="path-loop" d="M27,5 A22,22 0 1,1 5,27 A22,22 0 0,1 27,5" stroke-dasharray="157"></path>
                        </svg>
                    </div>
                    <div class="list">
                        <svg viewBox="0 0 54 54">
                            <path class="path-loop" d="M27,5 A22,22 0 1,1 5,27 A22,22 0 0,1 27,5" stroke-dasharray="157"></path>
                        </svg>
                    </div>
                    <div class="list">
                        <svg viewBox="0 0 54 54">
                            <path class="path-loop" d="M27,5 A22,22 0 1,1 5,27 A22,22 0 0,1 27,5" stroke-dasharray="157"></path>
                        </svg>
                    </div>
                    <div class="list">
                        <svg viewBox="0 0 54 54">
                            <path class="path-loop" d="M27,5 A22,22 0 1,1 5,27 A22,22 0 0,1 27,5" stroke-dasharray="157"></path>
                        </svg>
                    </div>
                    <div class="list">
                        <svg viewBox="0 0 54 54">
                            <path class="path-loop" d="M27,5 A22,22 0 1,1 5,27 A22,22 0 0,1 27,5" stroke-dasharray="157"></path>
                        </svg>
                    </div>
                </div>
                <div class="line"></div>
            </div>
        </div>

        <div class="index2">
            <div class="wrap">
                <div class="common_title">
                    <div class="l">工作动态</div>
                    <a href="news.html" class="more">查看更多＋</a>
                </div>
                <div class="content">
                    <div class="l">
                        <div class="swiper swiper-container">
                            <div class="swiper-wrapper">
                                <div class="swiper-slide">
                                    <img src="./images/l_1.png" alt="">
                                    <div class="text">
                                        宁波材料所测试中心顺利通过CMA复评审和扩项现场评审
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="button">
                            <svg t="1712492023818" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1752" width="200" height="200"><path d="M384 883.08c-8.19 0-16.38-3.12-22.62-9.38-12.5-12.5-12.5-32.75 0-45.25L677.83 512 361.38 195.55c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L734.4 478.07c18.72 18.72 18.72 49.16 0 67.88L406.62 873.7c-6.24 6.25-14.43 9.38-22.62 9.38z m305.14-359.77h0.31-0.31z" fill="#333333" p-id="1753"></path></svg>
                            <svg t="1712492023818" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1752" width="200" height="200"><path d="M384 883.08c-8.19 0-16.38-3.12-22.62-9.38-12.5-12.5-12.5-32.75 0-45.25L677.83 512 361.38 195.55c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L734.4 478.07c18.72 18.72 18.72 49.16 0 67.88L406.62 873.7c-6.24 6.25-14.43 9.38-22.62 9.38z m305.14-359.77h0.31-0.31z" fill="#333333" p-id="1753"></path></svg>
                        </div>
                    </div>
                    <div class="r">
                        <a href="info.html" class="list">
                            <div class="circle"></div>
                            <p>宁波材料所召开“分园区业务管理平台"...</p>
                            <div class="time">2024-04-02</div>
                        </a>
                        <a href="info.html" class="list">
                            <div class="circle"></div>
                            <p>宁波材料所测试中心顺利通过CMA复评...</p>
                            <div class="time">2024-04-02</div>
                        </a>
                        <a href="info.html" class="list">
                            <div class="circle"></div>
                            <p>球差电镜技术表征MAX相/Xene材料...</p>
                            <div class="time">2024-04-02</div>
                        </a>
                        <a href="info.html" class="list">
                            <div class="circle"></div>
                            <p>平台党支部组织x射线显微镜在材料...</p>
                            <div class="time">2024-04-02</div>
                        </a>
                        <a href="info.html" class="list">
                            <div class="circle"></div>
                            <p>平台党支部组织金属材料力学性能分析...</p>
                            <div class="time">2024-04-02</div>
                        </a>
                    </div>
                </div>
                <div class="flex">
                    <div class="item on">
                        <div>
                            <span>中心资质</span>
                            <div class="line"></div>
                            <div class="eng">
                                Center<br>
                                qualification
                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div>
                            <span>预约流程</span>
                            <div class="line"></div>
                            <div class="eng">
                                Reservation<br>
                                process
                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div>
                            <span>预约入口</span>
                            <div class="line"></div>
                            <div class="eng">
                                Reservation<br>
                                entry
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="index3">
            <div class="wrap">
                <div class="common_title">
                    <div class="l">培训讲座</div>
                    <a href="news.html" class="more">查看更多＋</a>
                </div>
                <div class="content">
                    <div class="l">
                        <a href="info.html" class="list">
                            <div class="time">
                                <span>02</span>
                                <div class="color">2021-06</div>
                            </div>
                            <div class="pick">
                                高效的金相制样方案及EBSD试样制备案例分享
                            </div>
                        </a>
                        <a href="info.html" class="list">
                            <div class="time">
                                <span>02</span>
                                <div class="color">2021-06</div>
                            </div>
                            <div class="pick">
                                真空技术讲座通知
                            </div>
                        </a>
                        <a href="info.html" class="list">
                            <div class="time">
                                <span>02</span>
                                <div class="color">2021-06</div>
                            </div>
                            <div class="pick">
                                球差校正电镜技术新进展以及应用讲座
                            </div>
                        </a>
                        <a href="info.html" class="list">
                            <div class="time">
                                <span>02</span>
                                <div class="color">2021-06</div>
                            </div>
                            <div class="pick">
                                2021上半年仪器开放培训通知
                            </div>
                        </a>
                        <a href="info.html" class="list">
                            <div class="time">
                                <span>02</span>
                                <div class="color">2021-06</div>
                            </div>
                            <div class="pick">
                                2020年上海材料与制造区域中心元素分析技术...
                            </div>
                        </a>
                    </div>
                    <div class="r">
                        <img src="./images/bg.png" class="bg" alt="">
                        <div class="swiper swiper-container">
                            <div class="swiper-wrapper">
                                <div class="swiper-slide">
                                    <img src="./images/swiper_1.jpg" data-swiper-parallax-scale="0.77" alt="">
                                </div>
                                <div class="swiper-slide">
                                    <img src="./images/swiper_2.jpg" data-swiper-parallax-scale="0.77" alt="">
                                </div>
                                <div class="swiper-slide">
                                    <img src="./images/swiper_3.jpg" data-swiper-parallax-scale="0.77" alt="">
                                </div>
                            </div>
                        </div>
                        <div class="button">
                            <svg t="1712492023818" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1752" width="200" height="200"><path d="M384 883.08c-8.19 0-16.38-3.12-22.62-9.38-12.5-12.5-12.5-32.75 0-45.25L677.83 512 361.38 195.55c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L734.4 478.07c18.72 18.72 18.72 49.16 0 67.88L406.62 873.7c-6.24 6.25-14.43 9.38-22.62 9.38z m305.14-359.77h0.31-0.31z" fill="#333333" p-id="1753"></path></svg>
                            <svg t="1712492023818" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1752" width="200" height="200"><path d="M384 883.08c-8.19 0-16.38-3.12-22.62-9.38-12.5-12.5-12.5-32.75 0-45.25L677.83 512 361.38 195.55c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L734.4 478.07c18.72 18.72 18.72 49.16 0 67.88L406.62 873.7c-6.24 6.25-14.43 9.38-22.62 9.38z m305.14-359.77h0.31-0.31z" fill="#333333" p-id="1753"></path></svg>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="index4">
            <img src="./images/index4_bg.png" class="bg" alt="">
            <div class="wrap" id="scene">
                <div class="title">仪器平台</div>

                <img src="./images/n_%60.png" class="position1" alt="">
                <img src="./images/n_2.png" class="position2" alt="">
                <img src="./images/n_3.png" class="position3" alt="">
                <div class="bor_content">

                    <div class="flex">
                        <a href="./equipment.html" class="item" >
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e1.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                        <a href="./equipment.html"  class="item">
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e2.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                        <div class="item opacity">
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                            </div>
                        </div>
                        <div class="item opacity" >
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                            </div>
                        </div>
                        <a href="./equipment.html"  class="item">
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e3.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                        <a href="./equipment.html"  class="item" >
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e4.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                        <div class="item opacity">
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                            </div>
                        </div>
                    </div>
                    <div class="flex">
                        <a class="item opacity" >
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                            </div>
                        </a>
                        <a href="./equipment.html"  class="item">
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e5.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>

                        </a>
                        <a href="./equipment.html"  class="item">
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e6.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                        <a href="./equipment.html"  class="item" >
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e7.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                        <div class="item opacity">
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                            </div>
                        </div>
                        <a href="./equipment.html"  class="item" >
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e1.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                        <div class="item opacity">
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="bor_content sj_content" style="display: none;">

                    <div class="flex">
                        <a href="./equipment.html"  class="item" >
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e1.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                        <a href="./equipment.html"  class="item">
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e2.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                        <a href="./equipment.html"  class="item">
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e3.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                    </div>
                    <div class="flex">
                        <a href="./equipment.html"  class="item" >
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e4.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                        <a href="./equipment.html"  class="item">
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e5.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>

                        </a>
                    </div>
                    <div class="flex">

                        <a href="./equipment.html"  class="item">
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e6.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                        <a href="./equipment.html"  class="item" >
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e7.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                        <a href="./equipment.html"  class="item" >
                            <div class="box">
                                <div class="line"></div>
                                <div class="line1"></div>
                                <div class="picture">
                                    <img src="./images/e1.jpg" alt="">
                                    <div class="text">
                                        <div class="headline">仪器平台</div>
                                        <h1>高分子专业平台</h1>
                                        <div class="eng">Polymer professional platform</div>
                                    </div>
                                </div>
                            </div>
                        </a>
                    </div>
                </div>
            </div>
        </div>

        <div class="index5">
            <div class="wrap">
                <div class="title">
                    <h1>支撑队伍</h1>
                    <p>
                        我们对公共技术服务中心人员的要求是：<br>
                        责任心强，敬业爱岗，有强烈的服务意识，有为科研做奉献的精神；注重学习能力，做到一专多能。
                    </p>
                </div>
                <div class="content">
                    <div class="button">
                        <img src="./images/jt.png" alt="">
                        <img src="./images/jt2.png" alt="">
                    </div>
                    <div class="swiper swiper-container">
                        <div class="swiper-wrapper">
                            <div class="swiper-slide">
                                <div class="img">
                                    <img src="./images/pr_1.png" alt="">
                                </div>
                                <div class="text">卢焕明 正高级工程师</div>
                            </div>
                            <div class="swiper-slide">
                                <div class="img">
                                    <img src="./images/pr_2.png" alt="">
                                </div>
                                <div class="text">汪洋 正高级工程师</div>
                            </div>
                            <div class="swiper-slide">
                                <div class="img">
                                    <img src="./images/pr_3.png" alt="">
                                </div>
                                <div class="text">张晓红 副主任</div>
                            </div>
                            <div class="swiper-slide">
                                <div class="img">
                                    <img src="./images/per_1.png" alt="">
                                </div>
                                <div class="text">柯培玲  研究员</div>
                            </div>
                            <div class="swiper-slide">
                                <div class="img">
                                    <img src="./images/per_2.png" alt="">
                                </div>
                                <div class="text">李明 高级工程师</div>
                            </div>
                            <div class="swiper-slide">
                                <div class="img">
                                    <img src="./images/prer_3.png" alt="">
                                </div>
                                <div class="text">张公军 高级工程师</div>
                            </div>
                            <div class="swiper-slide">
                                <div class="img">
                                    <img src="./images/per_4.png" alt="">
                                </div>
                                <div class="text">戴莹莹 行政助理</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="footer">
            <img src="./images/foo_bg.png" class="bg" alt="">
            <div class="wrap">
                <div class="picture">
                    <img src="./images/foo_1.jpg" alt="">
                    <img src="./images/foo_2.jpg" alt="">
                    <img src="./images/foo_3.jpg" alt="">
                    <img src="./images/foo_4.jpg" alt="">
                    <img src="./images/foo_5.jpg" alt="">
                    <img src="./images/foo_6.jpg" alt="">
                </div>
                <div class="content">
                    <div class="l">
                        <strong>地址：</strong>中科院宁波材料技术与工程研究所所级中心（镇海区中官西路与庄市大道交叉口西南340米）<br>
                        <strong>联系电话：</strong>0574 - 86685252<br>
                        <strong>Email：</strong>daiyy@nimte.ac.cn
                    </div>
                    <div class="img">
                        <img src="./images/img.png" alt="">
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>
<script src="./js/jquery-3.6.1.min.js" type="text/javascript"></script>
<script src="./js/parallax.js"></script>
<script src="./js/luxy.js"></script>
<script src="./js/common.js"></script>
<script src="./js/swiper.js"></script>
</body>
<script>

    $('#scene').parallax();
    var index1 = new Swiper('.index1 .swiper', {
        speed:1000,
        autoplay: {
            delay: 4000,
            disableOnInteraction: false,
        },
        on: {
            slideChange() {
                $('.index1 .position .display .list').removeClass('on').eq(this.realIndex).addClass('on')
            }
        }
    })

    $('.index1 .position .display .list').click(function () {
        index1.slideToLoop($(this).index())
    })


    new Swiper('.index2 .l .swiper', {
        loop: true,
        spaceBetween: 20,
        navigation: {
            nextEl: '.index2 .wrap .l .button svg:last-child',
            prevEl: '.index3 .wrap .l .button svg:first-child',
        },
        autoplay: {
            delay: 4000,
            disableOnInteraction: false,
        },
    })

    new Swiper('.index3 .swiper', {
        slidesPerView: 1,
        spaceBetween: 20,
        parallax : true,
        loop: true,
        initialSlide: 1,
        centeredSlides: true,
        navigation: {
            nextEl: '.index3 .wrap .content .r .button svg:last-child',
            prevEl: '.index3 .wrap .content .r .button svg:first-child',
        },
        autoplay: {
            delay: 4000,
            disableOnInteraction: false,
        },
        breakpoints: {
            1024: {
                slidesPerView: 3,
                spaceBetween: 40,
            },
        }
    })

    if (document.documentElement.clientWidth > 1200) {
        new Swiper('.index5 .content .swiper', {
            speed: 1000,
            initialSlide: 3,
            centeredSlides: true,
            spaceBetween: 40,
            slidesPerView: 4,
            effect: 'coverflow',
            slideToClickedSlide: true,
            coverflowEffect: {
                rotate: 0,
                stretch: 20,
                depth: 92,
                modifier: 2,
                slideShadows: false,
            },
            parallax: true,
            loop: true,
            navigation: {
                nextEl: '.index5 .wrap .content .button img:last-child',
                prevEl: '.index5 .wrap .content .button img:first-child',
            },
            autoplay: {
                delay: 4000,
                disableOnInteraction: false,
            },
        })
    }else {
        new Swiper('.index5 .content .swiper', {
            speed: 1000,
            spaceBetween: 40,
            loop: true,
            navigation: {
                nextEl: '.index5 .wrap .content .button img:last-child',
                prevEl: '.index5 .wrap .content .button img:first-child',
            },
            autoplay: {
                delay: 4000,
                disableOnInteraction: false,
            },
        })
    }

    $('.index2 .wrap .flex .item').mouseenter(function(){
        $(this).addClass('on').siblings('.item').removeClass('on')
    })


</script>
</html>